<template>
    <view>
        <view class="pub_page pub_page_bg pub_mine_friend square_components_friends pub_header_padding">
            <pub-head headerName="ecology_send" :headerConfig="headerConfig"></pub-head>
            <pub-dialog v-show="dialogShow" dialogName="mine_friend" :dialogConfig="dialogConfig"
                @dialogBack="dialogBack"></pub-dialog>
            <z-paging ref="Zpaging" class="pub_page_scroll page_box lis_div" v-model="list" @query="getList"
                :refresher-enabled="true" :fixed="false">
                <div class="lis_box">
                    <div class="li" v-for="(li,key) in list" :key="key">
                        <div class="li_user">
                            <pub-image class="headimg" :src="li.avatar" :mode="'aspectFill'"></pub-image>
                            <div class="text">
                                <div class="name">{{ li.nickName }}
                                    <div class="span_2" v-if="li.vipAccount"></div>
                                    <div class="span_3">LV.{{ li.grade }}</div>
                                </div>
                                <div class="time">{{ li.createTime }}</div>
                            </div>
                        </div>
                        <div class="li_content" v-if="li.content">{{ li.content }}</div>
                        <div class="li_imgs">
                            <div class="img" @click="$comFun.toPreviewImage(img,li.pic)" v-for="(img,imgKey) in li.pic"
                                :key="imgKey" :style="{backgroundImage:'url('+img+')'}">
                            </div>
                        </div>
                        <div class="li_info">
                            <div class="time" @click="pageDeal('to_delete',li,key)">
                                <text class="icon icon-font-basic icon-b-delete-1"></text>
                            </div>
                            <div class="more">
                                <div class="txt" @click="toThumb(li,key)">
                                    <text v-if="li.selfThumb==1" class="icon-font-basic icon-b-taoxin3"></text>
                                    <text v-if="li.selfThumb==0" class="icon-font-basic icon-b-taoxin"></text>{{ li.thumb }}
                                </div>
                                <div class="txt" @click="openFriendsComments(li,key)">
                                    <text class="icon-font-basic icon-b-31pinglun"></text>{{ li.commentNum }}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </z-paging>
        </view>
        <friendsComments :postInfo="friendsCommentsInfo" :userInfo="userInfo"
            @closeFriendsComments="closeFriendsComments" />
    </view>
</template>

<script>
import friendsComments from '../square/components/friends_comments.vue'
export default {
    components: { friendsComments },
    data() {
        return {
            headerConfig: {
                title: '朋友圈',//标题栏内容
                left_type: 3,
            },
            dialogShow: false,
            dialogType: '',
            dialogData: '',
            dialogConfig: {
                title: '提示',//标题栏内容
                content: ''
            },

            list: [],

            friendsCommentsInfo: {
                show: false,
                id: '',
                key: -1
            },

            userInfo: {}
        };
    },
    onLoad() {
        this.getUserInfo();
    },
    methods: {
        dialogBack(data) {
            console.log(data);
            this.dialogShow = false;
            if (data.name == 'mine_friend' && data.key == 1) {
                this.pageDeal(this.dialogType)
            }
        },
        async getUserInfo() {
            const res = await this.$request.get('user/userInfo', {});
            // console.log(res);
            if (res.code == 200) {
                this.userInfo = res.result;
                setTimeout(() => {
                    this.$comFun.openLoading();
                    this.$refs.Zpaging.reload();
                }, 400)
            }
        },
        async getList(pageNo, pageSize) {
            let data = {
                pageNo: pageNo,
                pageSize: pageSize,
            };
            const res = await this.$request.get('quan/myQuanPage', data);
            this.$comFun.closeLoading();
            // console.log(res);
            if (res.code == 200) {
                res.result.records.forEach(li => {
                    li.pic = li.pic ? li.pic.split(",") : [];
                })
                this.$refs.Zpaging.complete(res.result.records);
            } else {
                this.$refs.Zpaging.complete(false);
            }
        },
        async toThumb(info, key) {
            if (info.selfThumb) {
                this.$comFun.toast('已点赞');
                return;
            }
            this.$comFun.openLoading();
            const res = await this.$request.get('quan/contentThumb', {
                contentId: info.id
            });
            // console.log(res);
            this.$comFun.closeLoading();
            if (res.code == 200) {
                this.$comFun.toast('点赞成功');
                this.list[key].selfThumb = 1;
                this.list[key].thumb++;
            } else {
                this.$comFun.toast(res.message);
            }
        },
        openFriendsComments(info, key) {
            this.friendsCommentsInfo = {
                show: true,
                id: info.id,
                key: key,
            }
        },
        closeFriendsComments(data) {
            console.log(data);
            if (data && data.postKey != -1) {
                this.list[data.postKey].commentNum++;
            } else {
                this.friendsCommentsInfo = this.$options.data().friendsCommentsInfo;
            }
        },
        async pageDeal(type, data_1, data_2) {
            switch (type) {
                case 'to_delete':
                    this.dialogData = {
                        id: data_1.id,
                        key: data_2
                    }
                    this.dialogShow = true;
                    this.dialogType = 'sure_delete';
                    this.dialogConfig = {
                        title: '提示',//标题栏内容
                        content: `是否确定删除？`
                    }
                    break;
                case 'sure_delete':
                    this.$comFun.openLoading();
                    const res = await this.$request.get('quan/deleteQuan', {
                        id: this.dialogData.id
                    });
                    this.$comFun.closeLoading();
                    // console.log(res);
                    if (res.code == 200) {
                        this.$comFun.toast('删除成功');
                        this.list.splice(this.dialogData.key, 1);
                    } else {
                        this.$comFun.toast(res.message)
                    }
                    break;
            }
        }
    },
};
</script>

<style lang="scss" scoped>
@import "@/common/css/square.scss";
</style>
